<template>
<!--  <br>{{ videoData }}-->
<!--{{query}}-->
  <div class="container-fluid">
    <div class="imgaa">
      <img src="../../assets/1.png" alt="">
    </div>
    <div class="row">
      <div class="col-4">
        <div class="asd">
          <router-link to="AdminMain">
            未审核
          </router-link>
        </div>
      </div>

      <div class="col-4">
        <div class="abd">
          <router-link to="Finished">
            已审核
          </router-link>
        </div>
      </div>

      <div class="col-4">
        <button @click="request.get('admin/logout').then(()=>router.push('admin'))" class="btn btn-outline-danger" style="width: 30%">退出</button>
      </div>
    </div>

    <div class="row" style=" margin-top:2%">
      <div class="col-1">
      </div>
      <div class="col-10">
        <div class="row">
          <div class="col-8" style="">
            <div class="title">
              <h3>标题:{{ videoData.title }}</h3>
              <h6>作者:{{ videoData.uuid }}</h6>
              <h6>上传时间:{{ videoData.up_time }}</h6>
            </div>
            <div class="video">
              <video :src="request.video(videoData.storage)" controls class="video">
              </video>
            </div>


            <div class="row" style="margin-top: 30px">
              <div class="col-4">
            <div class="gfh">
              <button type="submit" class="btn btn-outline-secondary" style="width: 60%" @click="submit(true)">通过</button>
            </div>
              </div>
              <div class="col-4">
            <div class="gfh2">
              <button type="submit" class="btn btn-outline-primary" style="width: 60%" data-bs-toggle="modal" data-bs-target="#exampleModal">驳回</button>
            </div>
              </div>
                <div class="col-4">
            <div class="gfh3">
              <button type="submit" class="btn btn-outline-info" style="width: 60%">
                <router-link to="adminMain">返回</router-link>
              </button>
            </div>
                </div>
            </div>

          </div>
          <div class="col-4" style="margin-top: 3%">
            <h4>视频封面:</h4>
            <div class="cvbd">
              <img :src="request.pic(videoData.cover_pic)" alt="" class="cvbd">
            </div>
            <h4>视频简介:</h4>
            <textarea style="min-height:180px;min-width:100%;max-height:180px;max-width:100%;word-break:break-all;"
                      v-model="videoData.info" readonly></textarea>

          </div>
        </div>
      </div>
      <div class="col-1">
      </div>

    </div>
  </div>
  <div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="exampleModalLabel">请选择驳回理由</h5>
          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" @click="query.reason=null"></button>
        </div>
        <div class="modal-body">
          <select v-model="query.reason" class="form-select">
            <option selected>内容包含敏感词汇</option>
            <option>宣传信息</option>
            <option>色情和暴力</option>
            <option>低俗</option>
            <option>违法违禁</option>
            <option>血腥暴力</option>
            <option>赌博诈骗</option>
            <option>人身攻击</option>
            <option>不良封面/标题</option>
          </select>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" @click="query.reason=null">Close</button>
          <button type="button" class="btn btn-primary" @click="submit(false)" data-bs-dismiss="modal">提交</button>
        </div>
      </div>
    </div>
  </div>
  <input type="hidden" v-model="query.videoid">
</template>

<script setup lang="ts">

import "bootstrap"
import {useRoute} from "vue-router";
import {Ref, ref, watch} from "vue";
import request from "@/hooks/request";
import {VideoData, VideoState} from "@/types/AllData";
import {router} from "@/router";

const route = useRoute()
const videoData = ref(VideoState)
request.get('admin/current').then(re=>{
  if (!re){
    confirm('请登录')
    router.push('admin')
  }
})
request.get('admin/getvideo/' + route.query.video_id).then(re => videoData.value = re).catch(reason => {
  confirm('请登录')
  router.push('admin')
})

const query=ref({
  pass:false,
  reason:null,
  videoid:route.query.video_id
})
// 当参数更改时获取用户信息
watch(
    () => route.query,
    async newParams => {
      query.value.videoid=newParams.video_id
      videoData.value = await request.get('admin/getvideo/' + newParams.video_id)
    }
)



const submit=(pass:boolean)=>{
  query.value.pass=pass
  request.get('admin/check_video',query.value).then(re=>{
    if (re)
    {
      router.replace('AdminMain')
    }
  })
}
</script>

<style src="../../assets/css/shenghe.css" scoped/>
<style src="../../assets/css/audit.css" scoped/>
<style scoped>

</style>